    @import './base.less';
    @import './normalize.less';


    // .body {
    //     min-width: 1240px;
    // }
    body {
        background-color: #fff;
    }

    .pannel {
        width: 1550px;
        margin: 0 auto;
    }

    video {
        width: 100%;
        height: auto;
    }

    // 导航栏
    .menu {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        top: 15px;
        left: 0px;
        transition: top .4s;
        // background-color: pink;
        z-index: 100;
        margin: 0 auto;
        width: 100%;
        // height: 5px;
        a {
            z-index: 999;

            img {
                width: 400px;
                height: 50px;
                margin: auto 0;
                z-index: 11;
            }
        }

        .menu_list {
            display: flex;
            margin-left: 60px;
            z-index: 100;

            .list_item {
                position: relative;
                padding-right: 60px;

                a {
                    font-size: 15px;
                    color: #302e2c;
                    font-weight: 800;
                    display: block;
                    height: 40px;
                    line-height: 40px;

                    &:hover {
                        border-bottom: solid 5px #ff983f;
                    }
                }

                .item_list {
                    position: absolute;
                    top: 35px;
                    left: -49px;
                    display: none;
                    width: 160px;
                    text-align: center;
                    z-index: 1;
                    // background-color: #fff;
                    border-radius: 10px;

                    a {
                        color: #9f9f9e;
                        font-weight: normal;
                        border-bottom: 0;

                        &:hover {
                            color: #ffb779;
                        }
                    }

                }

                .chec {
                    position: absolute;
                    top: -20px;
                    left: -582%;
                    width: 100vw;
                    height: 300px;
                    background-color: #fff;
                    z-index: -9999;
                    display: none;
                }

                .chec2 {
                    position: absolute;
                    top: -20px;
                    left: -682%;
                    width: 100vw;
                    height: 300px;
                    background-color: #fff;
                    z-index: -999;
                    display:none;
                }

                .chec3 {
                    position: absolute;
                    top: -20px;
                    left: -695%;
                    width: 100vw;
                    height: 300px;
                    background-color: #fff;
                    z-index: -999;
                    display: none;
                }

                .chec4 {
                    position: absolute;
                    top: -20px;
                    left: -894%;
                    width: 100vw;
                    height: 300px;
                    background-color: #fff;
                    z-index: -999;
                    display: none;
                }

                .chec5 {
                    position: absolute;
                    top: -20px;
                    left: -884%;
                    width: 100vw;
                    height: 300px;
                    background-color: #fff;
                    z-index: -999;
                    display: none;
                }

                .chec6 {
                    position: absolute;
                    top: -20px;
                    left: -984%;
                    width: 100vw;
                    height: 300px;
                    background-color: #fff;
                    z-index: -999;
                    display: none;
                }
            }
        }

        video {
            width: 100%;
            height: auto;
        }
    }
    // 导航栏背景
    .color{
        background-color: #fff;
    }
    .move {
        .big {
            position: absolute;
            left: 50%;
            bottom: 0;
            width: 55px;
            height: 97px;
            // background-color: red;
        }

        .small {
            position: absolute;
            bottom: 62px;
            left: 969px;
            width: 21px;
            height: 24px;
            // background-color: pink;
            animation: up 1s infinite alternate .4s;
        }

        .big_txt {
            position: absolute;
            bottom: 50px;
            left: 54%;
            font-size: 25px;
            color: #fff;
            font-weight: 800;
        }
    }

    // 动画
    @keyframes up {
        100% {
            transform: translateY(15px);
        }
    }

    .hot_top {
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        position: absolute;
        bottom: -103px;
        left: 0;
        width: 100%;
        height: 85px;
        font-size: 25px;
        color: #fff;
        background-color: #ff983f;
    }

    .play_heart {
        margin-top: 60px;
        // display: none;
        transition: top .3s;
        p {
            text-align: center;
        }

        span {
            white-space: pre-wrap;
            font-size: 24px;
        }

        .play {
            position: relative;
            display: flex;
            justify-content: center;

            #ho {
                padding-right: 23px;

                img {
                    width: 400px;
                    height: 270px;
                }

                .mask {
                    position: absolute;
                    top: 0;
                    width: 400px;
                    height: 270px;
                    font-size: 40px;
                    line-height: 270px;
                    display: none;
                    z-index: 1;
                    background: #FF983F;
                    opacity: 0.6;
                    font-weight: 800;
                    color: #fff;

                }
            }
        }
    }

    .business {
        text-align: center;
        margin-top: 60px;
        width: 1550px;
        background-color: #fbfbfb;
        width: 100%;

        h2 {
            font-size: 40px;
            color: #252423;
        }

        p {
            padding-bottom: 80px;

            span {
                white-space: pre-wrap;
                font-size: 14px;
                color: #959492;
            }
        }

        .games {
            display: flex;
            position: relative;

            .left {

                ul {
                    margin-left: 140px;
                    width: 265px;
                    height: 578px;
                    // background-color: red;
                    text-align: left;

                    li {
                        position: relative;
                        padding-bottom: 72px;

                        .top {
                            font-size: 32px;
                            font-weight: 600;
                        }

                        .bottom {
                            // margin-top: 10px;
                            // margin-left: 27px;
                            font-size: 16px;
                            font-weight: 300;
                        }
                    }
                }
            }

            .right {
                position: relative;

                img {
                    width: 925px;
                    height: 500px;
                }

                .ms {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 355px;
                    height: 500px;
                }

                .jl {
                    position: absolute;
                    right: -925px;
                    width: 570px;
                    height: 250px;
                }

                .cj {
                    position: absolute;
                    top: 250px;
                    left: 355px;
                    width: 570px;
                    height: 250px;
                }

                .wx {
                    position: absolute;
                    bottom: 125px;
                    right: -888px;
                    width: 169px;
                    height: 35px;
                }

                #span {
                    position: absolute;
                    bottom: 100px;
                    left: 417px;
                    display: block;
                    font-size: 14px;
                    color: #fff;
                    height: 20px;
                    // margin-left: -400px;
                    width: 492px;
                    display: none;

                }

                // 第一张图片
                #first,
                #third,
                #fourth {
                    position: absolute;
                    bottom: 125px;
                    right: 38px;
                    ;
                    width: 169px;
                    height: 35px;
                }

                #one,
                #three,
                #four {
                    position: absolute;
                    bottom: 100px;
                    left: 417px;
                    display: block;
                    font-size: 14px;
                    color: #fff;
                    height: 20px;
                    // margin-left: -400px;
                    width: 492px;
                    display: none;

                }
            }

            .box {
                position: absolute;
                bottom: 78px;
                left: 405px;
                width: 925px;
                height: 500px;
                background-color: rgba(0, 0, 0, 0.4);
                // z-index: -1;
                display: none;
            }
        }
    }
// 可持续发展
    .develop {
        position: relative;
        display: flex;
        justify-content: space-around;
        margin-top: 100px;
        background-color: #fff;
        width: 100%;

        .dp-left {
            position: relative;
            width: 610px;
            height: 466px;
            background-color: pink;
            margin-left: 165px;

            .lunbo {
                display: flex;
                overflow: hidden;

                img {
                    width: 610px;
                    height: 466px;
                }

            }

            // .swiper-pagination {
            //     position: absolute;
            //     bottom: 10px;
            //     left: 215px;
            // }
        }

        .dp-right {
            position: relative;
            width: 440px;
            height: 446px;
            // background-color: red;
            margin-right: 100px;

            .btn {
                margin-top: 100px;
                background: #252423;
                margin-left: -160px;
  
            }
            .active{
                background-color: #ffb575;
            }

            h2 {
                margin-top: 40px;
                margin-left: -160px;
            }

            p {
                margin-top: 40px;
                margin-left: -160px;
                width: 392px;
            }
        }
    }

    .dt {
        display: flex;
        justify-content: space-around;
        background-color: #fff;
        margin-top: 100px;

        .dt-left {
            width: 610px;
            height: 446px;
            background-color: red;
            margin-left: -13px;

            img {
                width: 610px;
                height: 446px;
            }
        }

        .dt-right {
            padding-left: 100px;
            width: 610px;
            height: 446px;
            // background-color: pink;  
            margin-left: -612px;

            >div {
                // background-color: blue;
                padding: 24px 5px;

                // margin-left: 20px;
                &:hover {
                    background-color: #ff983f;
                    color: #fff;
                }
            }

            h3 {
                font-size: 25px;
            }

            p {
                font-size: 18px;
            }
        }
    }


    .join {
        position: relative;
        margin-top: 100px;

        a {
            img {
                width: 100%;
                z-index: -99;
            }

            .you {
                position: absolute;
                bottom: 185px;
                left: 361px;
                width: 30px;
                height: 30px;
                color: #fff;
                z-index: 11;
                animation: right 1s infinite alternate .4s;
            }

            h1 {
                position: absolute;
                top: 30px;
                left: 357px;
                font-size: 60px;
                color: #fff;
            }

            p {
                position: absolute;
                top: 156px;
                left: 358px;
                font-size: 18px;
                color: #fff;
            }
        }
            // 动画
    @keyframes right {
        100% {
            transform: translateX(15px);
        }
    }

    }
    // 二维码
    .action {
        margin-top: 100px;
        min-height: 300px;

        h2 {
            font-size: 32px;
            font-weight: bold;
            color: #252423;
            text-align: center;

            p {
                font-size: 12px;
            }
        }

        .action_bigbox {
            margin-top: 70px;
            min-height: 200px;
            display: flex;
            flex-direction: row;
            justify-content: space-around;
            align-items: flex-start;

            .action_box {
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                position: relative;
                width: 142px;
                height: 142px;

                .one {
                    position: absolute;
                    top: 0px;
                    display: none;
                }
            }
        }
    }

    // 底部
    .footer {
        background-color: #393e4f;
        color: #b0afb9;

        .footer_box {
            display: flex;
            flex-direction: row;
            justify-content: space-around;
            align-items: center;

            .left_box {
                display: flex;
                flex-direction: row;
                justify-content: space-evenly;
                align-items: center;
                width: 500px;

                dl {
                    dt {
                        padding-bottom: 10px;
                    }

                    dd {
                        padding-top: 5px;
                    }
                }

                :nth-child(1) {
                    margin-top: 20px;
                }
            }

            .right_box {

                width: 700px;
                display: flex;
                flex-direction: column;
                justify-content: center;

                .right_box_1 {
                    display: flex;
                    flex-direction: row;
                    justify-content: space-between;
                }

            }
        }

    }